<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      th:replace="layouts/master(title = '学生列表')"><!--layouts文件路径-->

<th:block th:fragment="css">
    <!--如果没有内容，请保持-->
</th:block>

<div th:fragment="content">
    <!--Page content-->
    <!--==============================-->
    <!-- Button trigger modal -->
    <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
        新增学生
    </button>

    <div class="row">

        <table class="table table-bordered">
            <thead>
            <tr>
                <th>Id</th>
                <th>Id</th>
                <th>No</th>
                <th>Name</th>
                <th>Sex</th>
                <th>Age</th>
                <th style="width: 100px">操作</th>
            </tr>
            </thead>

            <div class="modal fade" tabindex="-1" role="dialog" id="myModal">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title">学生信息</h4>
                        </div>
                        <div class="modal-body">

                            <!--表单开始-->
                            <form id="formStudent">
                                <input type="hidden" id="studentId" name="id" value="">
                                <div class="form-group">
                                    <label for="no">No</label>
                                    <input type="text" class="form-control" id="no" name="no" placeholder="学号">
                                </div>
                                <div class="form-group">
                                    <label for="name">姓名</label>
                                    <input type="text" class="form-control" id="name" name="name" placeholder="姓名">
                                </div>
                                <div class="form-group">
                                    <label for="sex">性别</label>
                                    <select class="form-control" id="sex" name="sex">
                                        <option value="1">男</option>
                                        <option value="2">女</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="age">年龄</label>
                                    <input type="text" class="form-control" id="age" name="age" placeholder="年龄">
                                </div>
                            </form>

                            <!--表单结束-->

                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-primary" onclick="addStudent()">保存</button>
                        </div>
                    </div><!-- /.modal-content -->
                </div><!-- /.modal-dialog -->
            </div><!-- /.modal -->



            <tbody id="students">
            <tr th:each="student : ${students}">
                <td th:text="${student.id}"></td>
                <td th:text="${student.id}"></td>
                <td th:text="${student.no}"></td>
                <td th:text="${student.name}"></td>
                <td th:text="${student.sex}"></td>
                <td th:text="${student.age}"></td>
                <td><a href="#" th:href="@{/editStudent/{id}(id=${student.id})}" data-toggle="modal" data-target="#myModal">编辑</a></td>
                <td>
                    <a href="#" class="deleteStudent" data-id="${student.id}">删除</a>
                </td>
            </tr>
            </tbody>
        </table>

    </div>

    <!--==============================-->
    <!--End page content-->
</div>
<div th:fragment="scripts">
    <!--如果没有内容，请保持-->
    <script type="text/javascript" src="/pagejs/student/list.js"></script>
</div>

</html>

